<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 
            当多个选择器，选中同一个元素的时候，
            并且设置相同样式的时候，那么就会产生样式冲突
            css会使用优先级高的选择器选中的样式        

            内联样式： 1000
            id选择器： 100
            类和伪类： 10
            元素选择器：1
            * ：0
            继承的样式 ： 没有优先级


            选择器可以相加，但是再怎么加也加不到他的临界值

            选择器优先级谁高用谁，优先级相同谁在下面用谁
        */
        /* 类：1 id：100  101 */
        p#myp {
            background-color: yellowgreen;
            color: red;
        }

        body #myp {
            background-color: cadetblue;
        }




        .c1 {
            background-color: aqua;
        }

        .c1 {
            background-color: yellow;
        }


        p {
            background-color: red;
        }

        * {
            color: aqua;
        }
    </style>
</head>

<body>
    <p id="myp" class="c1 c2 c3">我是一个p标签 <span>我是一个span</span></p>


</body>

</html>